tkinter绘制组件(17) | 您所在的位置:网站首页 › tkinter 消息提示框 › tkinter绘制组件(17) |
tkinter绘制组件(17)——气泡提示
引言布局函数结构创建标识符创建提示信息绑定鼠标事件完整代码函数
效果测试代码最终效果2022-7-22新样式2022-8-12新样式
github项目pip下载结语
引言
气泡提示框的用处很大,一般地,它会以一种特殊的样式存在于整个GUI界面中的以下部分位置,如果我们不去激活它,那么它几乎不会占用用户界面。此外,用户很容易发现它,并且需要时是可以将鼠标至于其上,来获取帮助信息。 因此,我们在画布上绘制出这一种组件。 但是,受tkinter画布无法控制组件与画布对象的最高级,气泡提示组件无法覆盖Widget的组件类。 布局 函数结构 def add_info(self,pos:tuple,font='微软雅黑 9',fg='#0078d4',bg='white',info_text='',info_font=('微软雅黑','12'),info_width=200,info_fg='black'):#绘制提示框 ''' pos::位置 font::提示标识符“?”的字体 fg::提示标识符颜色 bg::整个组件的背景色 info_text::提示文本 info_font::提示文本字体 info_width::提示文本宽度 info_fg::提示文本颜色 ''' 创建标识符就目前而言,我并不希望TinUI info组件的提示标识符能够被自由定义,因为这样会降低TinUI界面的整体美观度。所以,我们目前就以“?”作为标识符。 还是那一句话:因为前面十几篇的经验,我们已经能足够熟练地排版绘制画布对象。这句话以后就不说了,关于绘制部分我只做说明,不会进行详细讲解,具体参考前面几篇文章。 标识符有椭圆外框和标识符文字构成。 现在,直接绘制标识符: text=self.create_text(pos,anchor='nw',text='?',font=font,fill=fg) bbox=self.bbox(text) back=self.create_oval((bbox[0]-2,bbox[1]-2,bbox[2]+2,bbox[3]+2),fill=bg,outline=fg,width=2) self.tkraise(text) 创建提示信息根据参数获取到的自定义提示信息,我们将要绘制气泡提示的主体。这里需要注意一点,那就是气泡提示的文本和背景不能够遮挡标识符,否则无法绑定标识符的事件,也无法完成我们期望标识符完成的工作。 现根据排版计算绘制提示文本: info=self.create_text((bbox[2]+10,(bbox[3]+bbox[1])//2),anchor='nw',text=info_text,font=info_font,fill=info_fg,width=info_width) ibbox=self.bbox(info) info_back=self.create_rectangle((ibbox[0]-2,ibbox[1]-2,ibbox[2]+2,ibbox[3]+2),width=1,fill=bg,outline=fg) self.tkraise(info)因为提示文本的显示取决于鼠标放置于标识符上方,而且,提示框背景和文本时同步显示或隐藏的,因此,为了方便,我们为其添加tag标识符。 infotagname='info'+str(info)+str(info_back) self.addtag_withtag(infotagname,info) self.addtag_withtag(infotagname,info_back) self.itemconfig(infotagname,state='hidden')很多人看到,在TinUI中,每次绑定tag标识符都是使用了str(画布对象)的方法,这么做是因为画布对象用窗口组建一样,有这在一个画布内唯一的ID,因此我们可以以此保证tag的绑定不会形成重叠影响。 绑定鼠标事件这就很简单了。 首先是显示和隐藏的功能: #infotagname来自于先前绑定的画布tag对象 def showinfo(event): self.itemconfig(infotagname,state='normal') def hideinfo(event): self.itemconfig(infotagname,state='hidden')接着绑定标识符事件,就完工领盒饭了。 self.tag_bind(back,'',showinfo) self.tag_bind(back,'',hideinfo) self.tag_bind(text,'',showinfo) self.tag_bind(text,'',hideinfo)为了方便他人操作,我们将标识符文字和背景全部绑定事件。 完整代码函数 def add_info(self,pos:tuple,font='微软雅黑 9',fg='#0078d4',bg='white',info_text='',info_font=('微软雅黑','12'),info_width=200,info_fg='black'):#绘制提示框 def showinfo(event): self.itemconfig(infotagname,state='normal') def hideinfo(event): self.itemconfig(infotagname,state='hidden') text=self.create_text(pos,anchor='nw',text='?',font=font,fill=fg) bbox=self.bbox(text) back=self.create_oval((bbox[0]-2,bbox[1]-2,bbox[2]+2,bbox[3]+2),fill=bg,outline=fg,width=2) self.tkraise(text) self.tag_bind(back,'',showinfo) self.tag_bind(back,'',hideinfo) self.tag_bind(text,'',showinfo) self.tag_bind(text,'',hideinfo) info=self.create_text((bbox[2]+10,(bbox[3]+bbox[1])//2),anchor='nw',text=info_text,font=info_font,fill=info_fg,width=info_width) ibbox=self.bbox(info) info_back=self.create_rectangle((ibbox[0]-2,ibbox[1]-2,ibbox[2]+2,ibbox[3]+2),width=1,fill=bg,outline=fg) self.tkraise(info) infotagname='info'+str(info)+str(info_back) self.addtag_withtag(infotagname,info) self.addtag_withtag(infotagname,info_back) self.itemconfig(infotagname,state='hidden') 效果 测试代码 def test(event): a.title('TinUI Test') b.add_paragraph((50,150),'这是TinUI按钮触达的事件函数回显,此外,窗口标题也被改变、首行标题缩进减小') b.coords(m,100,5) def test1(word): print(word) def test2(event): ok1() def test3(event): ok2() def test4(event): from time import sleep for i in range(1,101): sleep(0.02) progressgoto(i) def test5(result): b.itemconfig(scale_text,text='当前选值:'+str(result)) if __name__=='__main__': a=Tk() a.geometry('700x700+5+5') b=TinUI(a,bg='white') b.pack(fill='both',expand=True) m=b.add_title((600,0),'TinUI is a test project for futher tin using') m1=b.add_title((0,680),'test TinUI scrolled',size=2,angle=24) b.add_paragraph((20,290),''' TinUI是基于tkinter画布开发的界面UI布局方案,作为tkinter拓展和TinEngine的拓展而存在。目前,TinUI尚处于开发阶段。如果想要使用完整的TinUI,敬请期待。''', angle=-18) b.add_paragraph((20,100),'下面的段落是测试画布的非平行字体显示效果,也是TinUI的简单介绍') b.add_button((250,450),'测试按钮',activefg='white',activebg='red',command=test,anchor='center') b.add_checkbutton((80,430),'允许TinUI测试',command=test1) b.add_label((10,220),'这是由画布TinUI绘制的Label组件') b.add_entry((250,300),350,'这里用来输入') b.add_separate((20,200),600) b.add_radiobutton((50,480),300,'sky is blue, water is blue, too. So, what is your heart',('red','blue','black'),command=test1) b.add_link((400,500),'TinGroup知识库','http://tinhome.baklib-free.com/') _,ok1=b.add_waitbar1((500,220),bg='#CCCCCC') b.add_button((500,270),'停止等待动画',activefg='cyan',activebg='black',command=test2) bu1=b.add_button((700,200),'停止点状滚动条',activefg='white',activebg='black',command=test3)[1] bu2=b.add_button((700,250),'nothing button 2')[1] bu3=b.add_button((700,300),'nothing button 3')[1] b.add_labelframe((bu1,bu2,bu3),'box buttons') _,_,ok2=b.add_waitbar2((600,400)) b.add_combobox((600,550),text='你有多大可能去珠穆朗玛峰',content=('20%','40%','60%','80%','100%','1000%')) b.add_button((600,480),text='测试进度条(无事件版本)',command=test4) _,_,_,progressgoto=b.add_progressbar((600,510)) b.add_table((180,630),data=(('a','space fans over the world','c'),('you\ncan','2','3'),('I','II','have a dream, then try your best to get it!'))) b.add_paragraph((300,810),text='上面是一个表格') b.add_onoff((600,100)) b.add_spinbox((680,100)) b.add_scalebar((680,50),command=test5) scale_text=b.add_label((890,50),text='当前选值:2') b.add_info((680,140),info_text='this is info widget in TinUI') a.mainloop() 最终效果 2022-7-22新样式直接封装tooltip。 2022-8-12新样式指定文本最大宽度,width参数(来自tooltip更改) github项目TinUI的github项目地址 pip下载 pip install tinui 结语现在你可以将TinUI运用到你自己的tkinter项目了,甚至可以将TinUI最为窗口的唯一部件。你也可以再次基础上开发现代化的Text部件。 我开通了我自己的个人博客,欢迎访问。 🔆tkinter创新🔆 |
CopyRight 2018-2019 实验室设备网 版权所有 |